<template>
  <el-dialog
    :title="title"
    :visible.sync="openDlg"
    width="70%"
    append-to-body
    destroy-on-close
  >
   <el-form :model="classParams" ref="classForm" :inline="true">
      <el-form-item label="学生姓名">
        <el-input v-model="classParams.studentName" clearable placeholder="请输入学生姓名"></el-input>
      </el-form-item>
      <el-form-item label="注册号">
        <el-input v-model="classParams.regCode" clearable placeholder="请输入学生注册号"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button
          type="primary"
          icon="el-icon-search"
          size="mini"
          @click="classQuery"
          >搜索</el-button
        >
        <el-button icon="el-icon-refresh" size="mini" @click="classReset"
          >重置</el-button
        >
      </el-form-item>
    </el-form>
    <el-table :data="dataList" v-loading="loading">
      <el-table-column
        label="所在院系"
        align="center"
        show-overflow-tooltip
        prop="collegeName"
      ></el-table-column>
      <el-table-column
        label="注册号"
        align="center"
        show-overflow-tooltip
        prop="regCode"
      ></el-table-column>
      <el-table-column
        label="姓名"
        align="center"
        show-overflow-tooltip
        prop="studentName"
      ></el-table-column>
      <el-table-column
        label="性别"
        align="center"
        show-overflow-tooltip
        prop="sex"
      >
        <template slot-scope="scope">
          <dict-tag :options="dict.type.sys_user_sex" :value="scope.row.sex"></dict-tag>
        </template>
      </el-table-column>
      <el-table-column
        label="专业"
        align="center"
        show-overflow-tooltip
        prop="specialityName"
      ></el-table-column>
      <el-table-column
        label="年级"
        align="center"
        show-overflow-tooltip
        prop="gradeName"
      ></el-table-column>
      <el-table-column
        label="班级"
        align="center"
        show-overflow-tooltip
        prop="className"
      ></el-table-column>
      <el-table-column
        label="辅导员姓名"
        align="center"
        show-overflow-tooltip
        prop="clrName"
      ></el-table-column>
    </el-table>
    <!-- 修改了分页显示条件 -->
    <pagination
      v-show="dataTotal > 0"
      :total="dataTotal"
      :page.sync="classParams.pageNum"
      :limit.sync="classParams.pageSize"
      @pagination="getListDate"
      class="mt-4"
    />
      
  </el-dialog>
</template>

<script>
import { getApprInfoStudent, getNotApprInfoStudent,getFiledStudent } from "@/api/flowable/fields.js";

export default {
  name: "tableIndex",
  dicts: ["sys_user_sex"],
  data() {
    return {
      openDlg: false,
      dataList: [],
      dataTotal: 0,
      title: "",
      classParams: {
        pageNum: 1,
        pageSize: 10,
        regCode: '',
        studentName: ''
      },
      classify: '',
      loading: false, // 加载状态
    };
  },

  methods: {
    open(data, type,classify) {
      // 重置分页参数
      this.classParams = {
        pageNum: 1,
        pageSize: 10,
        ...data,
      };
      this.classify = classify
      
      if (type === "Y") {
        this.title = "已填写学生";
      } else {
        this.title = "未填写学生";
      }
      
      this.openDlg = true;
      this.getListDate();
    },
    classQuery() {
      this.getListDate()
    },
    classReset() {
      this.classParams.regCode = ''
      this.classParams.studentName = ''
      this.getListDate()

    },
    async getListDate() {
      this.loading = true;
      this.dataList = [];
      
      try {
        let response;
        
        if (this.classify == 'college' && this.classParams.filledType === "Y") {
          response = await getApprInfoStudent(this.classParams);
        } else if (this.classify == 'college' && this.classParams.filledType === "N") {
          response = await getNotApprInfoStudent(this.classParams);
        } else{
          response = await getFiledStudent(this.classParams);
        }
        
        this.dataList = response.rows || [];
        this.dataTotal = response.total || 0;
      } catch (error) {
        console.error("获取数据失败:", error);
        this.$message.error("获取数据失败，请重试");
      } finally {
        this.loading = false;
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.residue {
  display: flex;
  justify-content: center;
  margin-bottom: 30px;
  
  &-item + &-item {
    margin-left: 10px;
  }
}
</style>